<template>
    <div class="header">
        <h1>凹兔基的博客</h1>
        <nav class="nav-menu">
            <ul>
                <li @click="goToRouter('')"><a>首页</a></li>
                <li @click="goToRouter('content')"><a>文章</a></li>
                <li @click="goToRouter('introduce')"><a>关于我</a></li>
                <li @click="goToRouter('contact')"><a>联系方式</a></li>
            </ul>
        </nav>
    </div>
</template>
<script lang="ts" setup>
import { defineComponent } from 'vue';
import { useRouter } from 'vue-router'
defineComponent({
  name: 'AtjHeader',
});
const router = useRouter()
const goToRouter = (name:string) => {
    router.push(`/${name}`)
}
</script>
<style lang="less" scoped>
@import '@/assets/css/universal.css';
</style>